<!DOCTYPE html>
{extend name="common/application" /}
{block name="title"}<title>个人中心-消息中心</title>{/block}
{block name="css"}
<link rel="stylesheet" type="text/css" href="_CSS_/help.css"/>
<link rel="stylesheet" type="text/css" href="_CSS_/message.css"/>
<style>
    .menuConBody {
        padding: 20px 30px;
    }

    .hasData {
        overflow: hidden;
    }

    .hasData p {
        line-height: 50px;
        font-size: 14px;
    }

    .message-list li {
        overflow: hidden;
    }

    .message-list label {
        width: 420px;
    }

    .read .list-l {
        color: #999999 !important;
    }

    .read p {
        color: #999999 !important;
    }
	.nodatas{text-align:center;padding:100px 0;width:850px;}
	.nodatas img{margin:100px 0 50px 0;}
	.message-box .message-list .list-l1{width:400px;margin-right:60px;}
	.message-box .message-list .list-l2{width:120px;margin-right:30px;}
	.message-box .message-list .list-l2 p{width:100%;}
	.message-box .message-list .list-l4{height:50px;line-height:50px;}
</style>
{/block}
<!-- 主体内容 -->
{block name="content"}

<!-- 主体内容 -->
<div class="main">
    <div class="mainBody normalBox clearfix">
        <!--左菜单-->
        <ul class="menuList fl">
            <li>
                <a class="menuItem dropBg" href="personal.html"><span class="icons icon-account"></span>账户管理</a>
                <div class="childMenu">
                    <a class="menuchildItem" href="personal.html">个人资料</a>
                    <a class="menuchildItem" href="certification.html">实名认证</a>
                    <a class="menuchildItem" href="account.html">账户安全</a>
                </div>
            </li>
            <li>
                <a class="menuItem dropBg" href="order.html"><span class="icons icon-order"></span>我的订单</a>
                <div class="childMenu">
                    <a class="menuchildItem" href="order.html">我的订单</a>
                </div>
            </li>
            <li>
                <a class="menuItem dropBg" href="collect_news.html"><span class="icons icon-collection"></span>我的收藏</a>
                <div class="childMenu">
                    <a class="menuchildItem" href="collect_news.html">资讯收藏</a>
                    <a class="menuchildItem" href="collect_course.html">课程收藏</a>
                    <a class="menuchildItem" href="collect_products.html">商品收藏</a>
                    <a class="menuchildItem" href="collect_stores.html">店铺收藏</a>
                </div>
            </li>
            <li>
                <a class="menuItem dropBg" href="address.html"><span class="icons icon-address"></span>地址管理</a>
                <div class="childMenu">
                    <a class="menuchildItem" href="address.html">地址管理</a>
                </div>
            </li>
            <li>
                <a class="menuItem dropBg" href="judge.html"><span class="icons icon-evaluate"></span>评价管理</a>
                <div class="childMenu">
                    <a class="menuchildItem" href="judge.html">评价管理</a>
                </div>
            </li>
            <li>
                <a class="menuItem dropBg" href="complain.html"><span class="icons icon-price"></span>申述退款</a>
                <div class="childMenu">
                    <a class="menuchildItem" href="complain.html">申述</a>
                    <a class="menuchildItem" href="refund_money.html">退款</a>
                </div>
            </li>
            <li class="showChild bb0">
                <a class="menuItem dropBg" href="message.html"><span class="icons icon-news"></span>消息中心</a>
                <div class="childMenu">
                    <a class="menuchildItem activeMenu" href="message.html">消息中心</a>
                </div>
            </li>
        </ul>
        <!--右内容-->
        <div class="menuContent fr">
            <div class="menuConHeader">
                <!--面包屑导航-->
                <div class="breadcrumb">
                    <p>当前位置：
                        <a href="message.html">消息中心</a> &gt;
                        <a class="curPage" href="javascript:;">消息</a>
                    </p>
                </div>
            </div>
			<input type="hidden" id="value">
            <div class="menuConBody">
                <!--筛选-->
                <div class="one_tab">
                    <a class="oneType active_on" href="javascript:;" value="1">卖家消息</a>
                    <a class="oneType" href="javascript:;" value="2">平台消息</a>
                </div>
                <!--无数据-->
                <!--<div class="noData hide">-->
                <!--<img src="images/Nocollection.png"/>-->
                <!--<p>还没有相关收藏，<a class="goLinks" href="government.html">前往政务中心</a>查看资讯</p>-->
                <!--</div>-->
                <div class="hasData">
                    <div class="message-box">
                        <div class="message-title">
                            <div class="message-t message-t1"><input class="mainCheck" type="checkbox" name=""></div>
                            <div class="message-t message-t2"><a class="sign-btn" href="javascript:;">标记为已读</a></div>
                            <div class="message-t message-t3"><p>消息</p></div>
                            <div class="message-t message-t4"><p>发件人</p></div>
                            <div class="message-t message-t5"><p>时间</p></div>
                            <div class="message-t message-t6"><p>操作</p></div>
                        </div>
                        <div class="message-list">
                            <ul id="king">
                                <!--<li>-->
                                <!--<div class="list-l list-l1">-->
                                <!--<label class="text_overflow"><input class="childCheck" type="checkbox" name="">什么嘛，搞得神神秘秘的</label>-->
                                <!--</div>-->
                                <!--<div class="list-l list-l2"><p>王小二</p></div>-->
                                <!--<div class="list-l list-l3"><p>2018.03.15</p></div>-->
                                <!--<div class="list-l list-l4"><a class="cl-b" href="javascript:;" onclick="check_mes()">查看</a></div>-->
                                <!--</li>-->
                                <!--<li>-->
                                <!--<div class="list-l list-l1">-->
                                <!--<label class="text_overflow"><input class="childCheck" type="checkbox" name="">什么嘛，搞得神神秘秘的什么嘛，搞得神神秘秘的</label>-->
                                <!--</div>-->
                                <!--<div class="list-l list-l2"><p>王小二</p></div>-->
                                <!--<div class="list-l list-l3"><p>2018.03.15</p></div>-->
                                <!--<div class="list-l list-l4"><a class="cl-b" href="javascript:;" onclick="check_mes()">查看</a></div>-->
                                <!--</li>-->
                                <!--<li>-->
                                <!--<div class="list-l list-l1">-->
                                <!--<label class="text_overflow"><input class="childCheck" type="checkbox" name="">什么嘛，搞得神神秘秘的什么什么什么什么吗神神秘秘</label>-->
                                <!--</div>-->
                                <!--<div class="list-l list-l2"><p>王小二</p></div>-->
                                <!--<div class="list-l list-l3"><p>2018.03.15</p></div>-->
                                <!--<div class="list-l list-l4"><a class="cl-b" href="javascript:;" onclick="check_mes()">查看</a></div>-->
                                <!--</li>-->
                                <!--<li>-->
                                <!--<div class="list-l list-l1 list-lr">-->
                                <!--<label class="text_overflow"><input class="childCheck" type="checkbox" name="">什么什么什么什么吗神神秘秘什么嘛，搞得神神秘秘的什么嘛，搞得神神秘秘的</label>-->
                                <!--</div>-->
                                <!--<div class="list-l list-l2"><p>王小二</p></div>-->
                                <!--<div class="list-l list-l3"><p>2018.03.15</p></div>-->
                                <!--<div class="list-l list-l4"><a class="cl-b" href="javascript:;" onclick="check_mes()">查看</a></div>-->
                                <!--</li>-->
                                <!--<li class="read">-->
                                <!--<div class="list-l list-l1 list-lr">-->
                                <!--<label class="text_overflow"><input class="childCheck" type="checkbox" name="">什么什么什么什么吗神神秘秘什么嘛，搞得神神秘秘的什么嘛，搞得神神秘秘的什么嘛，搞得神神秘秘的</label>-->
                                <!--</div>-->
                                <!--<div class="list-l list-l2"><p>王小二</p></div>-->
                                <!--<div class="list-l list-l3"><p>2018.03.15</p></div>-->
                                <!--<div class="list-l list-l4"><a class="cl-b" href="javascript:;" onclick="check_mes()">查看</a></div>-->
                                <!--</li>-->
                                <!--<li class="read">-->
                                <!--<div class="list-l list-l1 list-lr">-->
                                <!--<label class="text_overflow"><input class="childCheck" type="checkbox" name="">什么什么什么什么吗神神秘秘</label>-->
                                <!--</div>-->
                                <!--<div class="list-l list-l2"><p>王小二</p></div>-->
                                <!--<div class="list-l list-l3"><p>2018.03.15</p></div>-->
                                <!--<div class="list-l list-l4"><a class="cl-b" href="javascript:;" onclick="check_mes()">查看</a></div>-->
                                <!--</li>-->
                                <!--<li class="read">-->
                                <!--<div class="list-l list-l1 list-lr">-->
                                <!--<label class="text_overflow"><input class="childCheck" type="checkbox" name="">什么什么什么什么吗神神秘秘</label>-->
                                <!--</div>-->
                                <!--<div class="list-l list-l2"><p>王小二</p></div>-->
                                <!--<div class="list-l list-l3"><p>2018.03.15</p></div>-->
                                <!--<div class="list-l list-l4"><a class="cl-b" href="javascript:;" onclick="check_mes()">查看</a></div>-->
                                <!--</li>-->
                                <!--<li class="read">-->
                                <!--<div class="list-l list-l1 list-lr">-->
                                <!--<label class="text_overflow"><input class="childCheck" type="checkbox" name="">什么什么什么什么吗神神秘秘</label>-->
                                <!--</div>-->
                                <!--<div class="list-l list-l2"><p>王小二</p></div>-->
                                <!--<div class="list-l list-l3"><p>2018.03.15</p></div>-->
                                <!--<div class="list-l list-l4"><a class="cl-b" href="javascript:;" onclick="check_mes()">查看</a></div>-->
                                <!--</li>-->
                            </ul>
                        </div>
                        <div class="message-title message-foot">
                            <div class="message-t message-t1"><label><input class="mainCheck" type="checkbox" name=""
                                                                            style="margin-right: 10px;">全选</label></div>
                            <div class="message-t message-ba"><p><a class="del-btn" href="javascript:;">删除</a></p></div>
                        </div>
                    </div>
                </div>
                <div id="page"></div>
            </div>
        </div>
    </div>
</div>
{/block}


{block name="js"}
<script src="_P_/layer/layer.js"></script>

<script type="text/javascript">
    $(function () {
        postfile(1, 1);
    })
    $(document).ready(function () {
        $('.li4').addClass('showChild');
        $('.li41').addClass('activeMenu');
    });

	$(".oneType").on('click', function () {
        $(".oneType").removeClass('active_on');
        $(this).addClass('active_on');
        var value = $(this).attr('value');
        $("#value").val(value);
        postfile(1, value);
        $('#page').html('');
    })
	
    function postfile(page,category) {
        var userinfo = $.cookie('userinfo');
        if (userinfo != null) {
            var user_login = $.base64.decode(userinfo).split(",");
            $.ajax({
                type: "get",
                url: "{:url('api/form/message')}",
                data: {'uid': user_login[0], 'page': page,value: category},
                dataType: 'jsonp',
                success: function (msg) {
                    if (msg.code == 200) {
                        if (msg.data.count != 0) {
                            $(".message-box").show();
                            $(".nodatas").hide();
                            $("#king").html("");
                            for (var i = 0; i < msg.data.data.length; i++) {
                               var html = '';
                                if (category == 1) {
                                    if (msg.data.data[i].status == 1) {
                                        html += '<li id="' + msg.data.data[i].id + '"><div class="list-l list-l1 list-lr">' +
                                            '<label class="text_overflow"><input type="checkbox" name="allcheck">' + msg.data.data[i].content + '</label></div>' +
                                            '<div class="list-l list-l2 list-lr"><p  class="text_overflow" title="' + msg.data.data[i].username + '">' + msg.data.data[i].username + '</p></div>' +
                                            '<div class="list-l list-l3"><p>' + getMyDate(msg.data.data[i].time * 1000) + '</p></div>' +
                                            '<div class="list-l list-l4">' +
                                            '<a class="cl-b" href="javascript:;" onclick="check_mes(' + msg.data.data[i].id + ')">查看</a></div>' +
                                            '</li>';
                                    } else {
                                        html += '<li id="' + msg.data.data[i].id + '"><div class="list-l list-l1">' +
                                            '<label class="text_overflow"><input type="checkbox" name="allcheck">' + msg.data.data[i].content + '</label>' +
                                            '</div><div class="list-l list-l2 list-lr"><p  class="text_overflow" title="' + msg.data.data[i].username + '">' + msg.data.data[i].username + '</p></div>' +
                                            '<div class="list-l list-l3"><p>' + getMyDate(msg.data.data[i].time * 1000) + '</p></div>' +
                                            '<div class="list-l list-l4">' +
                                            '<a class="cl-b" href="javascript:;" onclick="check_mes(' + msg.data.data[i].id + ')">查看</a></div>' +
                                            '</li>';
                                    }
                                } else {
                                    if (msg.data.data[i].status == 1) {

                                        html += '<li id="' + msg.data.data[i].id + '"><div class="list-l list-l1 list-lr">' +
                                            '<label class="text_overflow"><input type="checkbox" name="allcheck">' + msg.data.data[i].title + '</label></div>' +
                                            '<div class="list-l list-l2 list-lr"><p  class="text_overflow" title="知果汇">知果汇</p></div>' +
                                            '<div class="list-l list-l3"><p>' + getMyDate(msg.data.data[i].time * 1000) + '</p></div>' +
                                            '<div class="list-l list-l4">' +
                                            '<a class="cl-b" href="javascript:;" onclick="check_mes2(' + msg.data.data[i].id + ')">查看</a></div>' +
                                            '</li>';
                                    } else {
                                        html += '<li id="' + msg.data.data[i].id + '"><div class="list-l list-l1">' +
                                            '<label class="text_overflow"><input type="checkbox" name="allcheck">' + msg.data.data[i].title + '</label>' +
                                            '</div><div class="list-l list-l2 list-lr"><p  class="text_overflow" title="知果汇">知果汇</p></div>' +
                                            '<div class="list-l list-l3"><p>' + getMyDate(msg.data.data[i].time * 1000) + '</p></div>' +
                                            '<div class="list-l list-l4">' +
                                            '<a class="cl-b" href="javascript:;" onclick="check_mes2(' + msg.data.data[i].id + ')">查看</a></div>' +
                                            '</li>';
                                    }
                                }
                                $("#king").append(html);
                            }
                            if (msg.data.data.length == 0) {
                                $('#page').html('');
                            } else {
                                var value = $("#value").val();
                                if (!value) {
                                    value = 1;
                                }
                                $('#page').html(msg.data.render);
                                $("#pagination").delegate("a", "click", function () {
                                    var num = $(this).attr("num");
                                    if (num) {
                                        postfile(num, value);
                                    }
                                });
                                var pages = Math.ceil(msg.data.count / 10);
                                $("#GO").on('click', function () {
                                    var king = $("#go").val();
                                    if (king > pages) {
                                        layer.alert("最多输入" + pages + "页");
                                        return;
                                    }
                                    postfile(king, value);
                                });
                            }
                        } else {
                            $(".message-box").hide();
                            $("#king").html("");
                            $(".hasData").append("<div class='shelvs-main'><div class='nodatas'><img src='/static/web/images/nodatas01.png'><p>抱歉，暂无数据</p></div>");
                        }
                    }
                }
            })
        } else {
            window.location.href = "{:url('index/login/index')}";
        }
    }

    // 更改已读
    $(".sign-btn").on('click', function () {
		var value = $("#value").val();
		if (!value) {
			value = 1;
		}
        var arrs = new Array();
        $("#king input[name='allcheck']:checked").each(function () {
            arrs.push($(this).parents('li').attr('id'));
        });
        var uids = arrs.join(",");
        $.ajax({
            type: "get",
            url: "{:url('api/form/del_all')}",
            data: {'uid': uids, 'status': 1, value: value},
            dataType: 'jsonp',
			beforeSend: function () {
                var index = layer.load(1, {
                    shade: [0.1, '#333333'] //0.1透明度的白色背景
                });
			},
            success: function (msg) {
                layer.closeAll();
                postfile(1, value);
                $(".mainCheck").prop('checked', false);
            }
        })
    })

    // 删除
    $(".del-btn").on('click', function () {
        var value = $("#value").val();
        if (!value) {
            value = 1;
        }
		var arrs = new Array();
        $("#king input[name='allcheck']:checked").each(function () {
            arrs.push($(this).parents('li').attr('id'));
        });
        var uids = arrs.join(",");
        $.ajax({
            type: "get",
            url: "{:url('api/shop/del_all')}",
            data: {'uid': uids, 'status': 3},
            dataType: 'jsonp',
			beforeSend: function () {
                var index = layer.load(1, {
                    shade: [0.1, '#333333'] //0.1透明度的白色背景
                });
			},
            success: function (msg) {
                 layer.closeAll();
                postfile(1, value);
                $(".mainCheck").prop('checked', false);
            }
        })
    })

    /*买家消息查看*/
    function check_mes(id) {
        layer.open({
            type: 2,
            title: '查看',
            skin: 'layui-layer-lan',
            area: ['560px', '400px'], //宽高
            content: 'check_mes.html#' + id
        });
    }
	/*系统消息查看*/
    function check_mes2(id) {
        layer.open({
            type: 2,
            title: '查看',
            skin: 'layui-layer-lan',
            area: ['560px', '350px'], //宽高
            content: 'check_mes2.html#' + id
        });
    }
    //实现全选反选
    $(".message-title input:checkbox").on('click', function () {
        $(".message-title input:checkbox").prop("checked", $(this).prop('checked'));
        $(".message-list input:checkbox").prop("checked", $(this).prop('checked'));
    })
    $(".message-list input:checkbox").on('click', function () {
        //当选中的长度等于checkbox的长度的时候,就让控制全选反选的checkbox设置为选中,否则就为未选中
        if ($(".message-list input:checkbox").length === $(".message-list input:checked").length) {
            $(".message-title input:checkbox").prop("checked", true);
        } else {
            $(".message-title input:checkbox").prop("checked", false);
        }
    });
    //标记已读
    $('.sign-btn').on("click", function () {
        $(".message-list input:checked").parents('.list-l').addClass('list-lr');
    })
    //删除
    $('.del-btn').on("click", function () {
        $(".message-list input:checked").parents('li').remove();
    })


</script>
{/block}